<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <div id="test"></div>

    <script src="../js/react.development.js"></script>
    <script src="../js/react-dom.development.js"></script>
    <script src="../js/babel.min.js"></script>
	<script type="text/javascript" src="../js/prop-types.js"></script>
    <script type="text/babel">
    // class test {
    //     constructor(name,age){
    //         this.name = name
    //         this.age = age  
    //     }
    //     a = 'ceshi'
    //     say(){
    //         console.log('say');
    //     }
    //     static b= 'cehsi'
    // }
    // const t1 = new test('xiaowng','12')
    // console.log(test.b);
    // console.log(t1);
        class MyComponent extends React.Component{
            constructor(props){
                super(props)
            }
            render(){
                // const {ishot} = this.state
                const {name,age,sex} = this.props
                return (
                    <ul>
                        <li>姓名：{name}</li>
                        <li>年龄：{age}</li>
                        <li>性别：{sex}</li>
                    </ul>
                )
            }
            static propTypes = {
                name : PropTypes.string.isRequired,
                age:PropTypes.number
            }
        }
        let objdata ={name:'xiaoliu',age:24,sex:"男性"}
        ReactDOM.render(<MyComponent {...objdata}/>, document.getElementById('test'));

    </script>
</body>
</html>